<template>
  <div>
    <div v-if="!actives">
      <van-tabs v-model="active" @click="showNews">
        <van-tab title="新闻">
          <Mynews></Mynews>
        </van-tab>
        <van-tab title="标签 2">内容 2</van-tab>
        <van-tab title="标签 3">内容 3</van-tab>
        <van-tab title="标签 4">内容 4</van-tab>
      </van-tabs>
    </div>
    <!--  -->
    <div v-if="actives == 2">
      <Myuser></Myuser>
    </div>
    <!--  -->
    <div v-if="actives == 3">
      <Exit></Exit>
    </div>
    <!--  -->
    <div>
      <van-tabbar v-model="actives" @change="onChange">
        <van-tabbar-item icon="home-o">主页</van-tabbar-item>
        <van-tabbar-item icon="search">标签 2</van-tabbar-item>
        <van-tabbar-item icon="friends-o">信息</van-tabbar-item>
        <van-tabbar-item icon="setting-o">标签 4</van-tabbar-item>
      </van-tabbar>
    </div>
    <!--  -->
    <div></div>
    <!--  -->
    <div></div>
    <!--  -->
    <div></div>
    <!--  -->
    <div></div>
    <!--  -->
    <div></div>
    <!--  -->
  </div>
</template>

<script>
import Mynews from "./Mynews.vue";
import Myuser from "./Myuser.vue";
import Exit from "./Exit.vue";
export default {
  name: "",
  data() {
    return {
      active: 0,
      actives: 2,
    };
  },
  props: {},

  components: {
    Mynews,
    Myuser,
    Exit,
  },

  created() {},

  mounted() {
    this.showNews();
  },

  methods: {
    showNews() {
      console.log(">>>", this.active);
    },
    onChange(res){
      console.log(">>>>", res)
      this.actives = res
      // if (res == 0){
      //   this.$router.push('/')
      // } else if (res == 2){
      //   this.$router.push('/user')
      // }
    }
  },

  computed: {},

  watch: {},

  directives: {},

  filters: {},
};
</script>

<style scoped>
* {
  margin: 0;
}
</style>
